import Vue from 'vue'
import App from './App.vue'

// 引入路由器
import router from '@/router/index.js'

import TypeNav from '@/components/TypeNav/index.vue'
import SlideLoop from '@/components/SlideLoop/index.vue'
import Pagination from '@/components/Pagination/index.vue'
// 全局注册组件 非路由组件被多个组件使用  前面是名称 后面是组件
Vue.component('TypeNav',TypeNav)
Vue.component('SlideLoop',SlideLoop)
Vue.component('Pagination',Pagination)

// 引入vuex
import store from './store/index.js'

import '@/mock/mockServer.js' //引入mockServer 模拟接口生效

// 引入swiper.css
import 'swiper/css/swiper.css'

// 直接获取接口请求函数文件需要的对象
import * as API from '@/api/index.js'

import {Button, Message, MessageBox,Input} from 'element-ui'
// 直接注册使用 element-ui 的button组件
Vue.use(Button)
Vue.use(Input)

// 绑定在Vue原型上的 ui组件
Vue.prototype.$msgbox = MessageBox
Vue.prototype.$alert = MessageBox.alert
Vue.prototype.$message = Message

// 图片懒加载
// 引入图片懒加载的包
import VueLazyLoad from 'vue-lazyload'
// 引入未加载出来时的 图片
import loading from '@/assets/images/loading.jpg'
Vue.use(VueLazyLoad,{loading})

import '@/utils/validate.js'   // 引入验证的包


// 测试接口
// import {reqCategoryList,reqUserAddressList,reqTradeInfo} from './api/index.js'
// reqUserAddressList()
// reqTradeInfo()
// reqCategoryList()

Vue.config.productionTip = false  // 不显示生产提示
new Vue({
  beforeCreate() {
    Vue.prototype.$bus = this,   // 安装全局事件总线 用于组件间通信
    Vue.prototype.$API = API    // 将API接口放到vue原型上
    
  },
  render: h => h(App),
  router,  // 配置路由  所有组件都可以使用 this.$router 和 this.$route
  store, // 可以使用this.$store
}).$mount('#app')
